<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>省生态委主页</title>
    <link href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="lib/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="lib/website/tb-page.css" rel="stylesheet">
    <script src="lib/jquery/jquery.1.10.2.min.js"></script>
    <script src="lib/bootstrap/js/bootstrap.min.js"></script>
    <script src="lib/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="lib/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="lib/website/function.js"></script>
    <script src="lib/website/interface.js"></script>
    <style type="text/css">
        .form-horizontal .control-label {
            text-align: left;
        }
    </style>
</head>

<body>
<div class="container-fluid">
    <div class="row header">
        <div class="col-md-8 col-sm-8">
            <h3>辽宁环保攻坚考核系统</h3>
        </div>
        <div class="col-md-4 col-sm-4 ">
            <h6 class="text-right">欢迎您! XX管理员@XXX.com</h6>
        </div>
    </div>
    <div class="row">
        <nav class="navbar navbar-default">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-top">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">辽宁环保攻坚考核系统</a>
            </div>
            <div class="collapse navbar-collapse" id="navbar-top">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="index.html">考核结果</a></li>
                    <li><a href="assess-department.html">考核评分</a></li>
                    <li><a href="assessed.html">数据上报</a></li>
                    <li><a href="dataAnalysis.html">数据分析</a></li>
                    <li><a href="#">用户管理</a></li>
                </ul>
            </div>
        </nav>
    </div>
    <div class="content">
        <div class="row">
            <div class="col-md-12">
                <table class="table table-striped table-hover table-bordered" id="table">
                    <!--<thead>-->
                    <!--<tr>-->
                    <!--<th data-checkbox='true'></th>-->
                    <!--<th>单位名称</th>-->
                    <!--<th>数据上报进度</th>-->
                    <!--<th>考核评分进度</th>-->
                    <!--<th>问卷调查进度</th>-->
                    <!--<th>考核结果</th>-->
                    <!--<th>操作</th>-->
                    <!--</tr>-->
                    <!--</thead>-->
                </table>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">


    function processFormatter(value,color) {
        return ["<div class='progress'> <div class='progress-bar' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='color:"+color+" width:"+value+"%'>"+value+"</div> </div>"];
//        return res.toFixed(2);
    }

    // createTable("#table", null, '#toolbar');
    //初始化Table
    $('#table').bootstrapTable({
        url: 'http://39.98.42.158/manage/getAssessmentPathList', //请求后台的URL（*）
        method: 'get', //请求方式（*）
        //toolbar: '#toolbar',                //工具按钮用哪个容器
        striped: true, //是否显示行间隔色
        cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
        pagination: true, //是否显示分页（*）
        sortable: false, //是否启用排序
        sortOrder: "asc", //排序方式
        // queryParams: oTableInit.queryParams,//传递参数（*）
        sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
        pageNumber: 1, //初始化加载第一页，默认第一页
        pageSize: 10, //每页的记录行数（*）
        pageList: [10, 25, 50, 100], //可供选择的每页的行数（*）
        search: false, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
        strictSearch: false,
        showColumns: false, //是否显示所有的列
        showRefresh: false, //是否显示刷新按钮
        minimumCountColumns: 2, //最少允许的列数
        clickToSelect: false, //是否启用点击选中行
        height: 500, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
        uniqueId: "ID", //每一行的唯一标识，一般为主键列
        showToggle: false, //是否显示详细视图和列表视图的切换按钮
        cardView: false, //是否显示详细视图
        detailView: false, //是否显示父子表
        dataType: 'json',
        queryParams: function (params) {
            var queryData = {}; //如果没有额外的查询参数的话就新建一个空对象，如果有的话就先装你的查询参数
            //然后增加这两个
            queryData.pageNo = (params.offset / params.limit) + 1;
            queryData.pageSize = params.limit;
            return queryData; //这个就是向服务端传递的参数对象
        },
        responseHandler: function (res) {
            console.log(res)
            var result = [];
            var rows = res.data.rows
            if (!res.data.rows) {
                return false;
            }
            var newrow = [];
            $.each(rows, function (index, value) {
                //{add by wuguofang 20181205 for 解决url中文乱码问题 begin
                //value.operate = '<a href=cityAssessment.html?areaName=' + value.city + '>查看详情</a>';
                var city = encodeURI(value.city);
                value.operate = '<a href=cityAssessment.html?areaName=' + city + '>查看详情</a>';
                //add by wuguofang 20181205 for 解决url中文乱码问题 end}
                newrow[index] = value;
            });
            result['rows'] = newrow
            result['total'] = res.data.totalRows
            console.log(result)
            return result;
        },
        contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
        smartDisplay: true,
        paginationLoop: true,
        striped: true,
        columns: [{
            field: 'city',
            title: '单位名称'
        }, {
            field: 'dataReportingProgress',
            title: '数据上报进度',
            sortable: true,
            width: 100,//宽度
            formatter:   function (value,row,index) {
                return ["<div class='progress'> <div class='progress-bar' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='background-color:green; width:"+value+"'>"+value+"</div> </div>"];
//        return res.toFixed(2);
            }
        }, {
            field: 'assessmentProgress',
            title: '考核评分进度'
        }, {
            field: 'surveyProgress',
            title: '问卷调查进度',
//        return res.toFixed(2);
        },
            {
                field: 'sumScore',
                title: '考核结果'
            },
            {
                field: 'operate',
                title: '操作'
            },
        ]
    });
</script>

</html>